@import "../../styles/base";

//附近的门店-详情
.ga-nearbyStore-detail{
  .banner{
    .img{
      width:100%;
    }
  }
  .tabs{
    background: #fff;
    padding:10rpx 0;
    @include display-flex;

    .item{
      @include wh(120rpx,40rpx,40rpx);
      border:1px solid #f0335d;
      color:#f0335d;
      text-align: center;
      @include border-radius(10rpx);
      font-size:24rpx;
      margin-left:50rpx;

      &.active{
        background: #f0335d;
        color:#fff;
      }
    }
  }
  .h1{
    padding:22rpx;
    text-align: center;
    font-size:26rpx;
  }

  .position{
    padding:10rpx;
    margin:0rpx 22rpx 20rpx;
    background: #fff;
    @extend %flex;
    @include align-items(center);

    .item1{
      p{
        margin-top:10rpx;
        font-size:22rpx;

        .gaIcon{
          margin-right:10rpx;
        }
      }
    }

    .item2{
      @include flex(0 0 auto);
      text-align: center;
    }
  }

  .hot-box{
    padding:0 22rpx;

    .img{
      width:100%;
    }
  }

  .slide-image{
    height: 100%;
    width: 100%;
  }

  .swiper-box{
    text-align: center;
    background: #fff;
    padding:0 22rpx;

    .desc{
      padding:20rpx 0;
      font-size:26rpx;
    }
  }
}
/* ---------------css--------------- */
::-webkit-scrollbar {
  width: 0;
  height: 0;
  color: transparent;
}
.shop {
  width: 750rpx;
  margin-top: 30rpx;
  z-index: -1;

  .shop_con {
    width: 710rpx;
    height:130rpx;
    margin: 0 auto;
    display: flex;
    justify-content: space-between;
    align-items: center;
   background: #fff;
   padding:25rpx 0;
    border-bottom: 1px solid #f0f0f0;

    .goodsimg {
      width: 160rpx;
      height: 130rpx;
      overflow: hidden;
      border: 1px solid #ccc;
      border-radius:10rpx;
      display: flex;
      justify-content:center;
      align-items:center;

      image {
        max-width: 100%;
        max-height:100%;
      }
    }

    .con {
      width:73%;
      height:100%;
      display: flex;
      flex-direction: column;
      justify-content: space-between;

      .con_top {
        width:100%;
        overflow: hidden;
        display: flex;
        flex-direction: column;
        justify-content:flex-start;
        align-items:flex-start;

        text{
         font-size: 28rpx;
         line-height:30rpx;
        }
        .ct_text{
        font-size: 22rpx;
        color:#949494;
        margin-top:10rpx;
        }
      }
      .con_bottom {
        width:100%;
        height: 50rpx;
        margin: 0 auto;
        overflow: hidden;
        display: flex;
        justify-content: space-between;
        align-items: center;

        .price {
          font-size:26rpx;
          color: #ff3a35;
        }
        .number {
          display: flex;
          justify-content: space-around;
          align-items: center;

          text {
           font-size: 27rpx;
           margin:0 20rpx;
          }

          image {
            width: 40rpx;
            height: 40rpx;
          }
        }
        .btn {
          /* width:30rpx;
          height:30rpx; */
          transform: scale(0.5);
          font-size: 60rpx;
          font-weight: 700;
        }
      }
    }
  }
}
.footer{
  width: 100%;
  height:90rpx;
  background: #666;
  position: fixed;
  bottom: 0;
  display: flex;
  justify-content: space-between;
  align-items: center;

  .f_lf{
    width: 25%;
    height:100%;
    position: relative;

    view{
      box-sizing: border-box;
      width:90rpx;
      height:90rpx;
      border-radius: 50%;
      border:7rpx solid #666;
      display: flex;
      justify-content: center;
      align-items: center;
      position: absolute;
      top:-20rpx;
      left: 50%;
      margin-left: -45rpx;
      background: #333;

      image{
        width:50rpx;
        height:50rpx;
      }
    }
  }
  .lf_bac{
    view{
      background: #1296db;
    }
    .amount{
      display: block;
      width:35rpx;
      height:35rpx;
      border-radius: 50%;
      background:#ff0000;
      font-size: 20rpx;
      color: #fff;
      text-align: center;
      line-height: 35rpx;
      position: absolute;
      top:-20rpx;
      left:115rpx;
    }
  }
  .f_cen{
    width: 45%;
    height:100%;
    display: flex;
    flex-direction: column;
    justify-content:center;
    align-items: flex-start;

    text{
     font-size: 23rpx;
     color: #ccc;
    }
    .cen_price{
      font-size: 30rpx;
      color:#fff;
    }
  }
  .f_rg{
    width: 30%;
    height:100%;
    background: #707070;
    display: flex;
    justify-content: center;
    align-items: center;

    text{
      font-size: 27rpx;
      color: #fff;
    }
  }
}

page{
  height:100%;
}
.model_show{
  display: block;
}
.model_none{
  display: none;
}
.model{
  width: 100%;
  height:100%;
  position:fixed;
  top:0;
  z-index: 2;
  background: rgba(0, 0, 0, 0.3);
   /* display: none; */
  .m_box{
    position: absolute;
    bottom: 90rpx;
    width: 100%;
    background: #fff;

    .m_title{
      width:100%;
      height:40rpx;
      font-size: 23rpx;
      text-align: center;
      line-height: 40rpx;
      background:#ffffcc;
    }
    .select_goods{
      width:100%;
      height:90rpx;
      background: #eee;
      box-sizing: border-box;
      padding: 0 25rpx;
      display: flex;
      justify-content: space-between;
      align-items: center;
      border-bottom: 0.5rpx solid #ccc;

      view{
        width:25%;
        font-size: 27rpx;
        color: #121314;
      }
      .m_remove{
        width: 20%;
        display: flex;
        justify-content: center;
        align-items: center;

        image{
          width: 35rpx;
          height:35rpx;
          margin-right: 10rpx;
        }
      }
    }
    .goods_list{
      width: 100%;
      height:100rpx;
       box-sizing: border-box;
      padding: 0 25rpx;
      border-bottom: 0.5rpx solid #dcdddd;
      display: flex;
      justify-content: space-between;
      align-items: center;

      text{
        font-size: 29rpx;
        color: #121314;
      }
      .gl_number {
        display: flex;
        justify-content: space-around;
        align-items: center;

        .gl_price{
          font-size:30rpx;
          color: #ff0000;
          margin-right:30rpx;
        }
        text {
          font-size: 27rpx;
          margin:0 20rpx;
        }
        image {
          width: 40rpx;
          height: 40rpx;
        }
      }
    }
  }
}
